<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>足迹网</title>
<link href="resources/css/style.css" rel="stylesheet" type="text/css" />
<link href="resources/css/bookkeeping.css" rel="stylesheet" type="text/css" />
<link href="resources/css/custom.css" rel="stylesheet" />
<script src="resources/js/jquery-1.10.2.js"></script>
<script src="resources/js/jquery-ui-1.10.4.custom.js"></script>
<script src="resources/js/jquery.validate.js" type="text/javascript"></script>
<script src="resources/js/bookkeeping.js" type="text/javascript"></script>
</head>
<body>
<div id="topPan"><a href="index"><img src="resources/images/10285a.png"/></a>
	<ul>
		<li><a href="./">首页</a></li>
		<li><span>记账</span></li>
		<li><a href="./">报表</a></li>
		<li><a href="./">账户</a></li>
		<li><a href="./">设置</a></li>
	</ul>
</div>
<div id="headerPan">
<div id="type">
	<div id="type-m">
		<div id="type-menu">
			<ul id="type-menu-ul">
				<li id="tm-1" class="tm-n">
				<a class="select" id="payout"></a>
				</li>
				<li class="tm-l tm-l-no"></li>
				<li id="tm-5" class="tm-n">
				<a class="" id="income"></a>
				</li>
				<li class="tm-l"></li>
				<li id="tm-2" class="tm-n">
				<a class="" id="transfers"></a>
				</li>
			</ul>
		</div>
		<div id="type-box-1">
		<form id="form1">
			<div id="tb-l">
				<div id="tb-img" class="img-box png" onmouseout="javascript:imgPanel.close('add');" onmouseover="javascript:imgPanel.open('add');">
					<img id="img-show-add" class="img-show" width="130" height="94" src="http://localhost:8080/resources/images/tally-new/default.gif?1399881914000">
				</div>
			</div>
			<div id="tb-m">
				<ul id="tbul-1" class="tb-ul tb-ul-1">
					<li class="tb-li">
						<label>分类：</label>
						<a class="fadd-pay" onclick="add-category()"></a>
						<div id="levelSelect-payout" class="levelSelect">
							<input class="ls-input" type="text" readonly="readonly" value="早午晚餐" onclick="showOption('ul_tb-category');">
							<input id="tb-category" type="hidden"  name="bookingCategory.id" autocomplete="off" value="17">
							<div class="ls ls1" style="visibility:hidden;" id="ul_tb-category">
								<div class="ls-box ls-box1 png">
									<ul id="ls-ul1-payout" class="ls-ul png">
									
									<c:forEach var="item" items="${payoutCategory }">
										<li id="ls-li-payout-001" class="ls-li">
											<span title="${item.key.name }">${item.key.name }</span> 
											<div class="ls ls2 ls2-hasChild" style="visibility:hidden;">
												<div class="ls-tit png">
													<div class="ls-tit-out png">
													<div class="ls-tit-in png"></div>
													</div>
												</div>
												<div class="ls-box png" >
													<ul id="ls-ul2-payout-001" class="ls-ul png">
													<c:forEach var="item2" items="${item.value }">
														<li id="ls-li-payout-001001" class="ls-li ls-li2" onclick="levelSelect('payout', '${item2.name }', '${item2.id }');" > 
															<span title="${item2.name }">${item2.name }</span>
														</li>
													</c:forEach>
													</ul>
												</div>
												<div class="ls-bot png">
												    <div class="ls-bot-out png">
												        <div class="ls-bot-in png"></div>
												    </div>
												</div>
											</div>
										</li>
									</c:forEach>
									
									</ul>
								</div>
								<div class="ls-bot png">
									<div class="ls-bot-out png">
										<div class="ls-bot-in png"></div>
									</div>
								</div>
							</div>
						</div>
					</li>
					<li class="tb-li">
						<label>账户：</label>
						<a class="fadd-acc" ></a>
						<div class="selectspan">
							<input id="tb-account_text" class="w_select" type="text" style="" onclick="showOption('ul_tb-account');" readonly="readonly" value="现金口袋" autocomplete="off">
							<input id="tb-account" type="hidden"  name="account.id" autocomplete="off" value="7">
							<ul id="ul_tb-account" class="w_select_box " style="width:100px;">
								<c:forEach var="item" items="${accountList }">
									<li id="tb-outAccount-1_v_153651863" onmousedown="optionSelect('${item.accountName}','${item.id}','account');" >${item.accountName}</li>
								</c:forEach>
							</ul>
						</div>
					</li>
					<li class="tb-li">
						<label>金额：</label>
						<input id="tb-amount" class="input money" type="text" name="amount" placeholder="请填写金额">
						<a id="tb-amount_calbtn" class="money-btn" ></a>
					</li>
				</ul>
				<ul class="tb-ul tb-ul-2">
					<li class="tb-li">
						<label>时间：</label>
						<input id="datepicker" class="input" type="text" value="2014-06-07" name="createTime">
					</li>
					<li class="tb-li">
						<label>项目：</label>
						<a class="fadd-pro" onclick="javascript:fast.showDialog('project');"></a>
						<div class="selectspan">
							<input id="tb-project_text" class="w_select" type="text" style="" onclick="showOption('ul_tb-project');" readonly="readonly" value="无" autocomplete="off">
							<input id="tb-project" type="hidden"  name="project.id" autocomplete="off">
							<ul id="ul_tb-project" class="w_select_box " style="width: 102px; left: 465px; top: 105px;">
								<li id="tb-project" value="" onmousedown="optionSelect('无','','project');">无</li>
								<c:forEach var="item" items="${projectList }">
								<li id="tb-project" class="" value="${item.id}" onmousedown="optionSelect('${item.name}','${item.id}','project');">${item.name}</li>
								</c:forEach>
							</ul>
						</div>
					</li>
					<li id="tb-li-seller" class="tb-li">
						<label>商家：</label>
						<a class="fadd-sto" onclick="javascript:fast.showDialog('seller');"></a>
						<div class="selectspan">
							<input id="tb-seller_text" class="w_select" type="text" style="" readonly="readonly" value="无" autocomplete="off" onclick="showOption('ul_tb-seller');">
							<input id="tb-seller" type="hidden"  name="seller.id" autocomplete="off">
							<ul id="ul_tb-seller" class="w_select_box " style="width: 102px; left: 672px; top: 105px;">
								<li id="tb-seller" value="" onmousedown="optionSelect('无','','seller');">无</li>
								<c:forEach var="item" items="${sellerList }">
								<li id="tb-seller_v_0" class="" value="${item.id}" onmousedown="optionSelect('${item.name}','${item.id}','seller');">${item.name}</li>
								</c:forEach>
							</ul>
						</div>
					</li>
				</ul>
				<ul class="tb-ul-3">
					<li class="tb-li">
						<input id="tb-memo" class="input default-memo" type="text" onblur="setDefaultMemo(this);" onfocus="clearDefaultMemo(this);" placeholder="点击填写备注" name="summary">
					</li>
				</ul>
			</div>
			<div id="tb-r">
				<ul class="tb-ul">
					<li id="tb-li-member" class="tb-li">
					<label>成员：</label>
					<a class="fadd-pro" ></a>
					<div class="selectspan">
						<input id="tb-member_text" class="w_select" type="text" style="" readonly="readonly" value="无" autocomplete="off" onclick="showOption('ul_tb-member');">
						<input id="tb-member" type="hidden"  name="member.id" autocomplete="off">
						<ul id="ul_tb-member" class="w_select_box " style="width: 102px; left: 875px; top: 70px;">
							<c:forEach var="item" items="${memberList }">
							<li id="tb-member_v_0" class="" value="${item.id}" onmousedown="optionSelect('${item.name}','${item.id}','member');">${item.name}</li>
							</c:forEach>
						</ul>
					</div>
					</li>
				</ul>
				<div class="tb-r-btn">
					<input id="tb-save" class="gg gg-exp-newitem-gg" type="button" style="cursor:pointer;" onclick="payout();">
				</div>
			</div>
		</form>
		</div>
		<form id="form2">
		<div id="type-box-2" style="display:none;">
			<div id="tb-l">
				<div id="tb-img" class="img-box png" onmouseout="javascript:imgPanel.close('add');" onmouseover="javascript:imgPanel.open('add');">
					<img id="img-show-add" class="img-show" width="130" height="94" src="http://localhost:8080/resources/images/tally-new/default.gif?1399881914000">
				</div>
			</div>
			<div id="tb-m">
				<ul id="tbul-1" class="tb-ul tb-ul-1">
					<li class="tb-li">
						<label>转出：</label>
						<a class="fadd-acc" onclick="javascript:fast.showAccountDialog();"></a>
						<span class="selectspan">
						<input id="tb-outAccount-1_text" class="w_select" type="text" style="" onfocus="Ysl.select('tb-outAccount-1',0,null).show();" readonly="readonly" value="现金口袋" autocomplete="off">
						</span>
					</li>
					<li class="tb-li">
						<label>转入：</label>
						<a class="fadd-acc" onclick="javascript:fast.showAccountDialog();"></a>
						<span class="selectspan">
						<input id="tb-outAccount-1_text" class="w_select" type="text" style="" onfocus="Ysl.select('tb-outAccount-1',0,null).show();" readonly="readonly" value="现金口袋" autocomplete="off">
						</span>
					</li>
					<li class="tb-li">
						<label>金额：</label>
						<input id="tb-outMoney-1" class="input money" type="text">
						<a id="tb-outMoney-1_calbtn" class="money-btn"></a>
					</li>
				</ul>
				<ul class="tb-ul tb-ul-2">
					<li class="tb-li">
						<label>时间：</label>
						<input id="tb-datepicker" class="input" type="text" value="2014.06.07 20:18" name="createTime">
					</li>
					<li class="tb-li">
						<label>项目：</label>
						<a class="fadd-pro" onclick="javascript:fast.showDialog('project');"></a>
						<span class="selectspan">
							<input id="tb-project_text" class="w_select" type="text" style="" onfocus="Ysl.select('tb-project',0,null).show();" readonly="readonly" value="无" autocomplete="off">
						</span>
					</li>
				</ul>
				<ul class="tb-ul tb-ul-3">
					<li class="tb-li">
						<input id="tb-memo" class="input default-memo" type="text" onblur="setDefaultMemo(this);" onfocus="clearDefaultMemo(this);" value="点击填写备注" name="summary">
					</li>
				</ul>
			</div>
			<div id="tb-r">
				<ul class="tb-ul">
				</ul>
				<div class="tb-r-btn">
					<input id="ta-save" class="gg gg-exp-newitem-gg" type="button" style="cursor:pointer;">
				</div>
			</div>
		</div></form>
	</div>
</div>
</div>


<div id="footerPan">
	<div id="footernextPan">
	<ul>
  <li><a href="./">Home </a>| </li>
  <li><a href="./">About us</a> | </li>
  <li><a href="./">Support </a>| </li>
  <li><a href="./">Clients</a> | </li>
  <li><a href="./">Contact </a> </li>
  </ul>
   <p>©green solution all right reaserved</p>
    <ul class="templateworld">
  	<li>Design By:</li>
	<li><a href="./" target="_blank">865171</a></li>
  </ul>
   <div id="footerPanhtml"><a href="./" target="_blank">XHTML</a></div>
   <div id="footerPancss"><a href="./" target="_blank">CSS</a></div>
	</div>
</div>
<div id="ModelOverlay" style="width: 1349px; height: 1198px; display: block; opacity: 0.7;"></div>
</body>
</html>
